<!DOCTYPE html>
<html lang="zh-CN">
<head><meta name="description" content="音乐授权书 - 若通音乐（Ruotong Music）。页面：certificate。高品质商用音乐与音效，授权便捷，企业合作支持。"><meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>音乐授权书</title>
  <style>
    :root{ --brand:#2fc8a3; --border:#262b31; --muted:#6b7280; }
    *{box-sizing:border-box}
    body{margin:0;background:#0b0d0f;color:#e5e7eb;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Arial,sans-serif}
    .sheet{width:880px;margin:30px auto;padding:28px;background:#111318;border:1px solid var(--border);border-radius:12px;box-shadow:0 6px 20px rgba(0,0,0,.06)}
    .title{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:12px}
    .title h1{margin:0;font-size:24px}
    .ribbon{display:inline-block;background:var(--brand);color:#fff;padding:4px 12px;border-radius:999px;font-weight:700}
    .grid{display:grid;grid-template-columns: 1.2fr 1fr;gap:10px 18px;margin-top:10px}
    .cell{padding:10px 12px;background:#fbfcfd;border:1px dashed var(--border);border-radius:10px}
    .cell span{color:var(--muted);margin-right:6px}
    .note{font-size:13px;color:#374151;background:#fbfbfb;border:1px dashed var(--border);border-radius:10px;padding:10px 12px;margin-top:8px}
    .footer{display:flex;justify-content:space-between;margin-top:20px;align-items:flex-end}
    .stamp{position:relative;width:160px;height:160px;border:3px solid #e11d48;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#e11d48;font-size:42px;font-weight:900}
    .stamp::after{content:"文化公司";position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-size:12px;letter-spacing:2px}
    .actions{display:flex;gap:10px;justify-content:center;margin-top:20px}
    .btn{border:1px solid #e5e7eb;padding:8px 12px;border-radius:8px;background:#111318;cursor:pointer}
    .btn-primary{background:var(--brand);color:#fff;border-color:transparent}
    @media print{ body{background:#111318}.actions{display:none}.sheet{box-shadow:none;border:none;margin:0;width:auto} }
  </style>

<!-- SEO 多语言模板：将 href 替换为实际三语路径 -->
<link rel="alternate" hreflang="zh" href="/zh/" />
<link rel="alternate" hreflang="en" href="/en/" />
<link rel="alternate" hreflang="ja" href="/ja/" />

<!-- JSON-LD 占位：为满足 CSP（script-src 'self'），请改为带 nonce/hash 的内联脚本，或由服务端注入。 -->

<meta name="theme-color" content="#000000" />
<!-- 占位：请替换为页面真实描述 --><!-- 占位：社交分享基础字段 -->
<meta property="og:type" content="website" />
<meta property="og:title" content="若通音乐素材平台" />
<meta property="og:description" content="高质量配乐与音效素材，支持试听、购买、下载授权。" />
<meta property="og:image" content="https://example.com/og-image.png" />

<!-- 占位：请替换为实际页面地址 --><link rel="canonical" href="https://example.com/" />
</head>
<body>
<style>
.skip-to-content{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
.skip-to-content:focus{left:16px;top:16px;width:auto;height:auto;z-index:10000;background:#fff;padding:8px 12px;border:1px solid #000;}
:focus-visible{outline:2px solid currentColor;outline-offset:2px;}
</style>
<a class="skip-to-content" href="#main">跳转到主内容</a>


  <div class="sheet" id="sheet">
    <div class="title">
      <div class="ribbon">Ruotong Music</div>
      <h1>音乐授权书</h1>
    </div>
    <div class="note">北京嘉道文华文化有限公司对非独家授权我们所有音频版权，并准许对该授权书授证书所许可使用者使用音乐作品，适用于制作传播使用。请妥善保存此授权书截图/打印件。</div>
    <div class="grid" id="grid"></div>
    <div class="footer">
      <div style="font-size:14px;color:#6b7280">授权日期：<span id="date"></span><br/>授权单位：北京嘉道文华文化有限公司</div>
      <div class="stamp">★</div>
    </div>
    <div class="actions"><button class="btn" onclick="window.print()">下载 / 打印授权书</button><button class="btn btn-primary" onclick="window.close()">关闭</button></div>
  </div>
  <script>
    function qs(n){return new URLSearchParams(location.search).get(n)}
    const id = qs("songId");
    const tracks = JSON.parse(localStorage.getItem("ruotong_tracks")||"[]");
    const song = tracks.find(t=>t.id===id);
    if(!song || !song.activated){
      document.querySelector("#sheet").innerHTML = '<div style="padding:40px;text-align:center">未找到授权信息，请先在“授权证书”中激活授权。</div>';
    }else{
      const g = document.querySelector("#grid");
      const rows = [
        ["授权项目：","使用"],["授权范围：",song.scope||"使用"],["授权用途：",song.usage||"使用"],
        ["授权地域：",song.region||"中国"],["授权期限：",song.duration||"随片永久"],
        ["音乐人：",song.artist],["版权所有：",song.uploader],["作品名称：",song.title],["作品地址：","（站内作品详情链接）"],["作品授权码：",song.code],
        ["被授权者：",song.activation.owner],["项目名称：",song.activation.project],["投放渠道：",song.activation.channels],["激活时间：",song.activation.activatedAt]
      ];
      for(const [k,v] of rows){ const cell=document.createElement("div");cell.className="cell";cell.innerHTML=`<span>${k}</span>${v}`;g.appendChild(cell); }
      document.querySelector("#date").textContent = new Date().toISOString().slice(0,10);
    }
  </script>

<!-- Ruotong Account Buttons (auto-wired) -->
<script>window.RUOTONG_API_BASE = window.RUOTONG_API_BASE || '/api';</script>
<link rel="stylesheet" href="/rt-assets/css/toast.css">
<link rel="stylesheet" href="/rt-assets/css/modal.css">
<script src="/rt-assets/js/toast.js" defer></script>
<script src="/rt-assets/js/modal.js" defer></script>
<script src="/rt-assets/js/account-actions.js" defer></script>


<script>
document.addEventListener('DOMContentLoaded', function(){
  try{ document.body.classList.add('rt-darkfix'); }catch(e){}
});
</script>

</body>
</html>
